<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script src="../js/echarts.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="../js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
		<style type="text/css">
			#nav{
				width: 600px;
				height: 400px;
			}
		</style>
	</head>
	<body>
		<!-- 
		显示云南地图 准备工作    
		需要准备矢量地图的数据
		 使用ajax获取矢量地图数据
		 在ajax的回调函数中注册地图矢量数据echarts.registerMap('YunnanMap'，矢量地图数据)
		 配置geo的type为'map' map为YunnanMap
		 -->
		<div id="nav">
			
		</div>
		<script type="text/javascript">
			var mCharts = echarts.init(document.getElementById('nav'))
			$.get('../json/province/yunnan.json',function(ret){
				echarts.registerMap('YunnanMap',ret)
				var option = {
					geo:{
						type:'map',
						map:'YunnanMap',//YunnanMap需要和registerMap中的第一个参数保持一致
						roam:true,//允许缩放拖动
						label:{
							show:true//显示各个地方的地名
						},
						zoom:1,//设置初始化的缩放比例
						center:[],//设置地图的中心点的坐标 可以通过地图矢量获取
						
						
					}
				}
				mCharts.setOption(option)
			})
			
		</script>
	</body>
</html>
